<template>
   <el-input ref="input" :maxlength="max" size="mini" :disabled="disabled" v-model="currentValue" @input.native="changeValue"></el-input>
</template>

<script>
    export default {
      props: {
        value: {
          type: String
        },
        disabled: {
          type: Boolean,
          default: false,
        },
        // 只允许字母
        onlyLetter: {
          type: Boolean,
          default: true
        },
        // 最大长度
        max: {
          type: Number,
          default : null
        }
      },
      data() {
        return {
          currentValue: ''
        }
      },
      methods: {
        focus() {
          this.$refs.input.focus()
        },
        onBlur() {
          this.$emit('blur')
        },
        changeValue(e) {
          const value = e.target.value
          // 只允许输入字母的模式
//          if (this.onlyLetter) {
//            if (! /^[A-Za-z]+$/.test(value)) {
//              this.$emit('input', this.right);
//              console.log(this.right)
//              return
//            }else {
//              this.right = value
//            }
//          }
//          this.currentValue = value
          this.$emit('input', value.toUpperCase());
        }
      },
      watch: {
        value(newVal) {
          this.currentValue = newVal
        },
//        currentValue(newVal,oldVal) {
//          const lastChar = newVal[newVal.length - 1]
//          if (this.onlyLetter) {
//            if (! /[a-zA-Z]/.test(lastChar)) {
//              this.currentValue = oldVal
//              return
//            }
//          }
//          if (this.max) {
//            if (newVal.length > this.max) {
//              this.currentValue = oldVal
//              return
//            }
//          }
//          this.currentValue = this.currentValue.toUpperCase()
//          this.$emit('input', this.currentValue);
//        }
      }
    }
</script>

<style lang="stylus" scoped>

</style>
